import { Opt } from '__com/Opt.js'
import moment from 'moment'
import rolesOpt from '@/option/roles.js'
import dateOpt from '@/option/date.js'

export class columnOpt extends Opt {
  constructor(fun) {
    super(fun)
  }

  create() {
    return [
      {
        field: 'roleName',
        title: '角色名称',
        minWidth: 150,
        header: {
          filter: rolesOpt.createSysRole({
            key: 'roleIds',
            title: '人员角色',
            multiple: false,
            data: {
              to: (v) => {
                console.log('zhk ~ file: column.js:23 ~ columnOpt ~ create ~ v:', v)
                return {
                  roleName: v.label
                }
              }
            }
          })
        }
      },
      {
        field: 'state',
        title: '角色状态',
        minWidth: 150,
        header: {
          filter: {
            title: '角色状态',
            key: 'state',
            placeholder: '请选择角色状态',
            select: {
              options: [
                {
                  value: '启用',
                  key: 1
                },
                {
                  value: '禁用',
                  key: 0
                }
              ]
            }
          }
        },
        cell: (info) => {
          return {
            value: (v) => {
              return info.state == 1 ? '启用' : '禁用'
            },
            text: {}
          }
        }
      },
      {
        title: '操作时间',
        field: 'updateTime',
        minWidth: 180,
        header: {
          filter: dateOpt.range({
            title: '操作日期',
            startKey: 'startDate',
            endKey: 'endDate',
            disabled: (date) => {
              return date.valueOf() > new Date().getTime()
            },
            check: (val) => {
              return dt.tool.checkDate(val.startDate, val.endDate, '操作日期跨度至多两年。')
            }
          })
        },
        cell: {
          value: (row) => {
            return `${moment(row.updateTime).format('YYYY-MM-DD')}`
          },
          text: {}
        }
      },
      {
        field: 'updateId',
        title: '操作人',
        minWidth: 150,
        header: {
          filter: {
            title: '操作人',
            key: 'updateId',
            placeholder: '请输入操作人',
            input: {}
          }
        }
      },
      {
        title: '备注',
        field: 'roleDesc',
        minWidth: 200,
        cell: {
          text: {
            lineClamp: 2,
            webkitBoxOrient: 'vertical',
            display: '-webkit-box',
            whiteSpace: 'inherit'
          }
        }
      },
      {
        title: '操作',
        field: 'operate',
        fixed: 'right',
        width: 160,
        cell: (info) => {
          return {
            btn: [
              {
                title: '编辑',
                color: '#3366FF',
                // code: '0501020000',
                click: (row) => {
                  this.editFun(row)
                }
              },
              {
                title: info.state == 1 ? '禁用' : '启用',
                color: info.state == 1 ? '#F33C3C' : '#19BE6B',
                // code: '0501030000',
                click: (row) => {
                  this.changeValidFlag(row)
                }
              }
            ]
          }
        }
      }
    ]
  }
}
